@include global.insights-open(1200px) {
  .actions {
    width: auto !important;
  }
}

.actions {
  width: 370px;

  @media only screen and (max-width: 870px) {
    width: 300px;
  }

  .icon {
    color: var(--iconsDefaultColor);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;

    &:hover {
      color: var(--iconsDefaultHoverColor);
    }

    :global(.euiIcon) {
      width: 18px;
      height: 18px;
    }

    .infoIcon {
      width: 20px;
      height: 20px;
    }
  }
}

.popoverContainer {
  display: flex;
  align-items: flex-start;

  .warningIcon {
    color: var(--euiColorWarningLight) !important;
    margin: 2px 6px 2px;
  }

  .popoverTitle {
    font:
      normal normal 500 13px/22px Graphik,
      sans-serif;
    color: var(--euiColorFullShade) !important;
  }

  .popoverFooter {
    display: flex;
    justify-content: flex-end;
    margin-top: 12px;
  }

  .popoverDBName {
    color: var(--htmlColor);
  }
}

.configWrapper {
  padding: 24px !important;
  box-shadow: 0px 3px 15px #00000099;
  background-color: var(--euiColorLightestShade) !important;
}
